<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="公众号：UnseeR.ico" type=";url=">

    <style type="text/css">
        @import url("chap.css");

    </style>

    <title>chap5</title>
</head>

<body>

    <!--目录-->
    <hr class="hr_chap" />
    <div>
        <a name="5">
            <a style="text-decoration: none;" href="#第5章 超链接">
                <h2>
                    第5章 超链接
                </h2>
            </a>
        </a>

        <a name="5.1">
            <a style="text-decoration: none;" href="#5.1 超链接概述">
                <h3>
                    5.1 超链接概述 --------------------------------------------
                </h3>
            </a>
        </a>

        <a name="5.2">
            <a style="text-decoration: none;" href="#5.2 超链接语法、路径及分类">
                <h3>
                    5.2 超链接语法、路径及分类 ------------------------------
                </h3>
            </a>
        </a>

        <a name="5.2.1">
            <a style="text-decoration: none;" href="#5.2.1 超链接a标记语法">
                <font>
                    <h4>
                        5.2.1 超链接a标记语法 -----------------------------------------
                    </h4>
                </font>
            </a>
        </a>

        <a name="5.2.2">
            <a style="text-decoration: none;" href="#5.2.2 超链接路径">
                <font>
                    <h4>
                        5.2.2 超链接路径 -----------------------------------------------
                    </h4>
                </font>
            </a>
        </a>

        <a name="5.2.3">
            <a style="text-decoration: none;" href="#5.2.3 超链接分类">
                <font>
                    <h4>
                        5.2.3 超链接分类 -----------------------------------------------
                    </h4>
                </font>
            </a>
        </a>

        <a name="5.3">
            <a style="text-decoration: none;" href="#5.3  超链接的应用">
                <h3>
                    5.3 超链接的应用 ------------------------------------------
                </h3>
            </a>
        </a>

        <a name="5.3.1">
            <a style="text-decoration: none;" href="#5.3.1 创建HTTP文件下载超链接">
                <font>
                    <h4>
                        5.3.1 创建HTTP文件下载超链接 --------------------------------
                    </h4>
                </font>
            </a>
        </a>

        <a name="5.3.2">
            <a style="text-decoration: none;" href="#5.3.2 创建FTP站点访问超链接">
                <font>
                    <h4>
                        5.3.2 创建FTP站点访问超链接 ----------------------------------
                    </h4>
                </font>
            </a>
        </a>

        <a name="5.3.3">
            <a style="text-decoration: none;" href="#5.3.3 创建图像链接">
                <font>
                    <h4>
                        5.3.3 创建图像链接 ---------------------------------------------
                    </h4>
                </font>
            </a>
        </a>

        <a name="5.3.4">
            <a style="text-decoration: none;" href="#5.3.4 创建电子邮件超链接">
                <font>
                    <h4>
                        5.3.4 创建电子邮件超链接 --------------------------------------
                    </h4>
                </font>
            </a>
        </a>

        <a name="5.3.5">
            <a style="text-decoration: none;" href="#5.3.5 创建页面书签链接">
                <font>
                    <h4>
                        5.3.5 创建页面书签链接 ----------------------------------------
                    </h4>
                </font>
            </a>
        </a>

        <a name="5.4">
            <a style="text-decoration: none;" href="#5.4  浮动框架">
                <h3>
                    5.4 浮动框架 ----------------------------------------------
                </h3>
            </a>
        </a>
    </div>
    <hr class="hr_chap" />

    <!--第5章 超链接-->
    <h2 class="h2_chap">
        <a name="第5章 超链接">
            <a style="text-decoration: none;" href="#5">
                <font>
                    第5章 超链接
                </font>
            </a>
        </a>
    </h2>

    <!--5.1 超链接概述-->
    <h3 class="h3_impo">
        <a name="5.1 超链接概述">
            <a style="text-decoration: none;" href="#5.1">
                <font>
                    5.1 超链接概述
                </font>
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                超链接是指从一个网页指向一个目标的连接关系。这个目标可以是：一个网页、图片、一个电子邮件地址、一个文件或是一个应用程序。
            </font>
        </li>
    </ul>

    <!--5.2 超链接语法、路径及分类-->
    <h3 class="h3_impo">
        <a name="5.2 超链接语法、路径及分类">
            <a style="text-decoration: none;" href="#5.2">
                5.2 超链接语法、路径及分类
            </a>
        </a>
    </h3>

    <!--5.2.1 超链接a标记语法-->
    <h3 class="h3_seco">
        <a name="5.2.1 超链接a标记语法">
            <a style="text-decoration: none;" href="#5.2.1">
                5.2.1 超链接a标记语法
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                基本语法
                <blockquote>
                    <font class="impo">&lt;a href</font>="url"<font class="impo"> name</font>="" <font class="impo">
                        title
                    </font>=""<font class="impo"> target</font>=""<font class="impo">&gt;</font> 超链接标题 <font
                        class="impo">&lt;/a&gt;</font>
                </blockquote>
            </font>
        </li>
        <li>
            <font>
                <abbr title="双标记"> a 标记 </abbr>属性说明
                <ol type="1">
                    <li>
                        <font>
                            <b>href</b>：链接指向的目标文件；
                        </font>
                    </li>
                    <li>
                        <font>
                            <b>name</b>：规定锚的名称；指向链接的提示信息；指定打开的目标窗口，有5种取值。
                        </font>
                    </li>
                    <li>
                        <font>
                            <b>title</b>：指向链接的提示信息；
                        </font>
                    </li>
                    <li>
                        <font>
                            <b>target</b>：指定打开的目标窗口，有5种取值。
                        </font>
                    </li>
                </ol>
            </font>
            <img src="5.1 target属性说明.png" alt="公众号：UnseeR">
        </li>
    </ul>

    <!--5.2.2 超链接路径-->
    <h3 class="h3_seco">
        <a name="5.2.2 超链接路径">
            <a style="text-decoration: none;" href="#5.2.2">
                5.2.2 超链接路径
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                超链接路径：<font class="impo">绝对路径</font>、<font class="impo">相对路径</font>、<font class="impo">根路径</font>。
            </font>
        <li type="1" value="1">
            <font>
                <b>绝对路径</b>指文件的完整路径，有<b> 2 </b>种：
            </font>
        <li type="none">
            <font>
                （1）从<font class="seco">盘符</font>开始定义的<font class="seco">文件路径</font>；
            </font>
        </li>
        <li type="none">
            <font>
                （2）从<b>协议</b>开始定义的<b>URL网址</b>。
            </font>
        </li>
        </li>
        </li>
        <li type="1" value="2">
            <font>
                <b>相对路径</b>是指相对于当前文件的路径，从当前文件所在位置指向目的文件的路径。
            </font>
            <img src="5.2 相对路径.png" alt="公众号：UnseeR">
        </li>
        <li type="1" value="3">
            <font>
                <b>根路径</b>是指从网站的最底层开始起，一般网站的根目录就是域名下对应的文件夹。以一个斜杠“<font class="impo">/</font>
                ”开头，代表<b>根目录</b>，然后书写<b>文件夹名</b>，最后书写<b>文件名</b>。例如 d:/download/index.html 。根路径<font class="seco">
                    一般用于创建内部链接</font>。
            </font>
        </li>
    </ul>

    <!--5.2.3 超链接分类-->
    <h3 class="h3_seco">
        <a name="5.2.3 超链接分类">
            <a style="text-decoration: none;" href="#5.2.3">
                5.2.3 超链接分类
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                超链接可以分为<font class="impo">内部链接</font>和<font class="impo">外部链接</font>
                两种。<b>内部链接</b>是指<b>网站内部文件之间</b>的链接，而<b>外部链接</b>是指<b>网站内的文件链接到站点内容外的文件</b>。
            </font>
        </li>
    </ul>

    <!--5.3  超链接的应用-->
    <h3 class="h3_impo">
        <a name="5.3  超链接的应用">
            <a style="text-decoration: none;" href="#5.3">
                <font>
                    5.3 超链接的应用
                </font>
            </a>
        </a>
    </h3>

    <!--5.3.1 创建HTTP文件下载超链接-->
    <h3 class="h3_seco">
        <a name="5.3.1 创建HTTP文件下载超链接">
            <a style="text-decoration: none;" href="#5.3.1">
                5.3.1 创建HTTP文件下载超链接
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                基本语法：
                <blockquote>&lt;a href=“<font class="impo">url</font>”> 链接内容 &lt;/a></&lt;a>
                </blockquote>
            </font>
        </li>
    </ul>

    <!--5.3.2 创建FTP站点访问超链接-->
    <h3 class="h3_seco">
        <a name="5.3.2 创建FTP站点访问超链接">
            <a style="text-decoration: none;" href="#5.3.2">
                5.3.2 创建FTP站点访问超链接
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                基本语法：<blockquote>&lt;a href = "<font class="impo">ftp://服务器IP地址或域名</font>"> 链接的文字 &lt;/a></blockquote>
            </font>
        </li>
    </ul>

    <!--5.3.3 创建图像链接-->
    <h3 class="h3_seco">
        <a name="5.3.3 创建图像链接">
            <a style="text-decoration: none;" href="#5.3.3">
                5.3.3 创建图像链接
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                基本语法：<blockquote>&lt;a href="URL"><font class="impo">&lt;img src</font>="" <font class="impo">alt</font>
                    =""<font class="impo">></font>&lt;/a></blockquote>
            </font>
        </li>
    </ul>

    <!--5.3.4 创建电子邮件超链接-->
    <h3 class="h3_seco">
        <a name="5.3.4 创建电子邮件超链接">
            <a style="text-decoration: none;" href="#5.3.4">
                5.3.4 创建电子邮件超链接
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                基本语法：
            </font>
            <blockquote>
                <font class="impo"></font>
                &lt;a href=“<font class="impo">mailto</font>:E-mail地址<font class="impo">[ ?subject=</font>邮件主题<font
                    class="impo">[&</font>参数=参数值<font class="impo">]]</font>”> 链接内容 &lt;/a>
            </blockquote>
        </li>
    </ul>

    <!--5.3.5 创建页面书签链接-->
    <h3 class="h3_seco">
        <a name="5.3.5 创建页面书签链接">
            <a style="text-decoration: none;" href="#5.3.5">
                5.3.5 创建页面书签链接
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                <b>书签</b>是指到<font class="impo">文章内部的链接</font>，可是实现段落间的任意跳转。实现这样的链接要<font class="seco">先定义书签名称和书签链接
                </font>。
            </font>
        </li>
        <li>
            <font>
                书签定义步骤:
            </font>
        </li>
        <li type="none">
            <font>
                <b>1、</b>定义<b>书签名</b>：
                <blockquote>
                    &lt;a <font class="impo">name</font>=“书签名称"> 书签标题 &lt;/a>
                </blockquote>
                <b>2、</b>定义<b>书签链接</b>：
                <blockquote>
                    &lt;a <font class="impo">href</font>="<font class="impo">#</font>书签名称"> 书签标题 &lt;/a> &lt;!-- <font
                        class="seco">同一页面内</font> --&gt;<br>
                    &lt;a <font class="impo">href</font>="<font class="impo">URL#</font>书签名称"> 书签标题 &lt;/a> &lt;!--
                    <font class="seco">不同页面间</font> --&gt;<br><br>
                    URL：是放置标记的HTML文件的URL，name：标记名。
                </blockquote>
            </font>
        </li>
    </ul>

    <!--5.4  浮动框架-->
    <h3 class="h3_impo">
        <a name="5.4  浮动框架">
            <a style="text-decoration: none;" href="#5.4">
                <font class="font_schap">
                    5.4 浮动框架
                </font>
            </a>
        </a>
    </h3>
    <ul>
        <li>
            <font>
                浏览器窗口含有孤立的子窗口称为<abbr title="也称为内联框架">浮动框架</abbr>。在浏览器窗口中使用&lt;iframe> &lt;/iframe>标记，可以嵌入浮动框架。
            </font>
        </li>
        <li>
            <font>
                基本语法：
                <blockquote>
                    <font class="impo"></font>
                    <font class="impo">&lt;iframe name</font>="name" 属性名称=""<font class="impo">>&lt;/iframe></font><br>
                    &lt;a href="target.html" <font class="seco">target</font>="<font class="impo">name</font>"> 链接标题
                    &lt;/a>
                </blockquote>
            </font>
        </li>
        <li>
            <font>
                属性说明
            </font>
            <br>
            <img src="5.4 浮动框架属性.png" alt="公众号：UnseeR" />
        </li>
        <li>
            <font>
                例如：
        <li type="none">
            <font>
                &lt;a href="mailto:<abbr title="同时发多个收件人">some@mysoft.com<font class="impo">;</font>
                    jlchu@163.com</abbr>?cc=xyz@163.com<abbr title="连接多个属性">
                    <font class="impo">&</font>
                </abbr>bcc=anbo@sina.com<abbr title="连接多个属性">
                    <font class="impo">&</font>
                </abbr><abbr title="邮件主题">subject=Hello</abbr><abbr title="表示空格">
                    <font class="seco">%20</font>
                </abbr>again<abbr title="连接多个属性">
                    <font class="impo">&</font>
                </abbr><abbr title="邮件内容">body=下周二开会讨论</abbr>">发送邮件</a><b>
                    <font class="impo"></font>
            </font>
        </li>
        </font>
        </li>
    </ul>

</body>

</html>
